<template>
  <div class="fullMain">
    <x-header
      class="custumHeader"
      :left-options="{backText: '',showBack: false}">
      <!-- <a slot="left">
         <i slot="overwrite-left" class="lIcon">X</i>
       </a>-->
      <span>项目计划</span>
      <!-- <a slot="right">
         <x-icon slot="overwrite-right" type="ios-more" size="35" style="position:relative;top:-8px;left:-3px;"></x-icon>
       </a>-->
    </x-header>
    <div class="mainbBg">
      <div class="menuHeader">
        <i class="fa fa-chevron-left mT returnIcon"></i>
        <span class="ids">
          姓名：老板
          <i class="fa fa-weixin icons"></i>
        </span>
      </div>
      <div class="tableDiv">
          <group class="allprojectP">
            <x-input title="项目名称"  placeholder="请输入项目名称" v-model="pName"></x-input>
          </group>
          <group class="allprojectP">
            <x-input title="项目类别"  placeholder="请输入项目类别"v-model="pLb"></x-input>
          </group>
          <group class="allprojectP">
            <x-input title="项目负责人"  placeholder="请输入项目负责人"v-model="pFzr"></x-input>
          </group>
          <group class="allprojectP">
            <datetime
              v-model="startTime"
              @on-change="change"
              :title="startLabel"
              @on-cancel="log('cancel')"
              @on-confirm="onConfirm"
              @on-hide="log('hide', $event)"></datetime>
          </group>
          <group class="allprojectP">
            <datetime
              v-model="endTime"
              @on-change="change"
              :title="endLabel"
              @on-cancel="log('cancel')"
              @on-confirm="onConfirm"
              @on-hide="log('hide', $event)"></datetime>
          </group>
          <group title="阶段计划" class="allprojectP">
            <div class="jdDiv">
              <span>2018-12-18</span>
              <span>至</span>
              <span>2018-12-18</span>
              <div class="jdContent">
                项目计划是根据对为了的项目决策，项目执行机构选择制定包括项目目标、工程标准、
                项目预算、实施程序及实施方案等的活动。在一个具体的项目环境中，它可以说是预先确定的行动纲领。
              </div>
            </div>
            <div class="jdDiv">
              <span>2018-12-18</span>
              <span>至</span>
              <span>2018-12-18</span>
              <div class="jdContent">
                项目计划是根据对为了的项目决策，项目执行机构选择制定包括项目目标、工程标准、
                项目预算、实施程序及实施方案等的活动。在一个具体的项目环境中，它可以说是预先确定的行动纲领。
              </div>
            </div>
            <div class="jdDiv">
              <span>2018-12-18</span>
              <span>至</span>
              <span>2018-12-18</span>
              <div class="jdContent">
                项目计划是根据对为了的项目决策，项目执行机构选择制定包括项目目标、工程标准、
                项目预算、实施程序及实施方案等的活动。在一个具体的项目环境中，它可以说是预先确定的行动纲领。
              </div>
            </div>
            <div class="jdDiv">
              <span>2018-12-18</span>
              <span>至</span>
              <span>2018-12-18</span>
              <div class="jdContent">
                项目计划是根据对为了的项目决策，项目执行机构选择制定包括项目目标、工程标准、
                项目预算、实施程序及实施方案等的活动。在一个具体的项目环境中，它可以说是预先确定的行动纲领。
              </div>
            </div>
            <div class="jdDiv">
              <span>2018-12-18</span>
              <span>至</span>
              <span>2018-12-18</span>
              <div class="jdContent">
                项目计划是根据对为了的项目决策，项目执行机构选择制定包括项目目标、工程标准、
                项目预算、实施程序及实施方案等的活动。在一个具体的项目环境中，它可以说是预先确定的行动纲领。
              </div>
            </div>
            <div class="jdDiv">
              <span>2018-12-18</span>
              <span>至</span>
              <span>2018-12-18</span>
              <div class="jdContent">
                项目计划是根据对为了的项目决策，项目执行机构选择制定包括项目目标、工程标准、
                项目预算、实施程序及实施方案等的活动。在一个具体的项目环境中，它可以说是预先确定的行动纲领。
              </div>
            </div>
            <div class="jdDiv">
              <span>2018-12-18</span>
              <span>至</span>
              <span>2018-12-18</span>
              <div class="jdContent">
                项目计划是根据对为了的项目决策，项目执行机构选择制定包括项目目标、工程标准、
                项目预算、实施程序及实施方案等的活动。在一个具体的项目环境中，它可以说是预先确定的行动纲领。
              </div>
            </div>
            <div class="jdDiv">
              <span>2018-12-18</span>
              <span>至</span>
              <span>2018-12-18</span>
              <div class="jdContent">
                项目计划是根据对为了的项目决策，项目执行机构选择制定包括项目目标、工程标准、
                项目预算、实施程序及实施方案等的活动。在一个具体的项目环境中，它可以说是预先确定的行动纲领。
              </div>
            </div>
          </group>
      </div>
    </div>
  </div>
</template>

<script>
  import { XHeader } from 'vux'
  import { XTable } from 'vux'
  import { XInput,Datetime,Group} from 'vux'
  import { Scroller } from 'vux'
  export default {
    data(){
      return {
        startLabel : "开始时间",
        startTime : "2018-12-18",
        endLabel : "截止时间",
        endTime : "2018-12-18",
        pStart : "",
        pEnd : "",
        pFzr: "负责人1",
        pLb: "类别",
        pName : "实验室管理项目",
      }
    },
    components:{
      XHeader,
      XTable,
      Scroller,
      XInput,
      Group,
      Datetime
    },
    methods:{
      log (str1, str2 = '') {
        console.log(str1, str2)
      },
      onConfirm (val) {
        console.log('on-confirm arg', val)
        console.log('current value', this.startTime)
      },
      change (value) {
        console.log('change', value)
      },
    }
  }
</script>

<style>
</style>
